<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>H5C3</title>
    <script src="jquery-3.4.1.js" type="text/javascript"></script>
    <style type="text/css">
        mark{
            background-color: burlywood;
        }
    </style>
</head>
<body>
<!--注释的使用-->
<!--标题的使用-->
<h1>Title</h1>
<h2>Title</h2>
<h3>Title</h3>
<h4>Title</h4>
<h5>Title</h5>
<h6>Title</h6>
<!--段落的使用-->
<p>这时候一大段内容，所以</p>
<p>要分成多个段落</p>
<!--换行-->
这是第一行<br />第二行
<!--横线-->
<hr />
<!--无序列表1,样式是是实心圆点-->
<ul type="disc">
    <li>鸡蛋</li>
    <li>面粉</li>
</ul>
<!--无序列表2,样式是是实心方点-->
<ul type="square">
    <li>鸡蛋</li>
    <li>面粉</li>
</ul>
<!--无序列表3,样式是是空心圆点-->
<ul type="circle">
    <li>鸡蛋</li>
    <li>面粉</li>
</ul>
<!--有序列表1,样式是数字-->
<ol type="1">
    <li>鸡蛋</li>
    <li>面粉</li>
</ol>
<!--有序列表2,样式是是实心方点-->
<ol type="A">
<!--type="a"，就是小写字母-->
    <li>鸡蛋</li>
    <li>面粉</li>
</ol>
<!--无序列表3,样式是阿拉伯数字-->
<ol type="I">
    <li>鸡蛋</li>
    <li>面粉</li>
</ol>
<!--表格-->
<table border="1" cellspacing="0" cellpadding="5" align="center" valign="top">
<!--valign的值可以是top，middle，bottom，baseline-->
    <tr>
        <th>Name</th>
        <th>Sex</th>
        <th>Age</th>
    </tr>
    <tr>
        <td colspan="2">第</td>
        <td>一</td>
<!--        <td>行</td>-->
    </tr>
     <tr>
        <td>啊</td>
        <td rowspan="2">2</td>
        <td>航</td>
    </tr>
     <tr>
        <td>呼</td>
<!--        <td>叁</td>-->
        <td>航</td>
    </tr>

</table>


<!--<datalist>和input一起使用-->
<input type="text" list="option123" placeholder="请选择"/>
<datalist id="option123">
    <option>good</option>
    <option>nice</option>
    <option>handsome</option>
    <option>great</option>
</datalist>

<!-- <details> -->
<details>
    <summary>sunck</summary>
    <p>sunck is a good man</p>
</details>

<!--mark加强语气-->
<p>i am a <mark>good</mark> man</p>

<!--进度条,script中添加了一个匿名函数，用于自动增加-->
<progress id="pro" max="100" value="0"></progress>

<form>
    <input type="range" max="100" min="0" step="10" value="10"/>
    <input type="date"/>
    <input type="submit" />
    <input type="email" />
    <input type="url" >
</form>
part

<script>
    var num = 0
    setInterval(function () {
    $("#pro").val(num+"")
        num++
    },100)
</script>
</body>
</html>